:root {
    font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
    line-height: 1.5;
    font-weight: 400;

    color-scheme: light dark;
    color: rgba(255, 255, 255, 0.87);
    background-color: #242424;

    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    --o1: #FFC857; /* 浅橙 */
    --o2: #FF8C2B; /* 深橙 */
    --txt: #0B1220; /* 深色文字（在亮按钮上可读） */
    --ring: rgba(255, 140, 43, .45);
    --glow: rgba(255, 165, 0, .35);
    /* 绿色（激活） */
    --g1: #34D399; /* emerald-400 */
    --g2: #22C55E; /* green-500  */
    --gglow: rgba(16, 185, 129, .45);
    --gring: rgba(134, 239, 172, .6); /* emerald-300 */
    /* 文本框颜色 */
    --border: #1C2540; /* 细线颜色 */
    --text: #E6EDF7; /* 普通文字 */
    --muted: #9AA4B2; /* 可选：次要文字 */
    --key: #FFC857; /* 橙黄色关键文字 */

    /* 标题前图表颜色 */
    --bar1: #38BDF8; /* sky-400 */
    --bar2: #22D3EE; /* cyan-400 */

    /* 菜单弹出面板背景色 */
    --panel: #0f1830f2; /* 95% 不透明（含 alpha） */

    /* 切换页面按钮颜色 */
    --panel-nav-btn: rgba(15, 24, 48, .45);
    --panel-hover-nav-btn: rgba(15, 24, 48, .58);
    --border-nav-btn: #1C2540;
    --ring-nav-btn: rgba(56, 189, 248, .45);
    --shadow-nav-btn: 0 10px 30px rgba(0, 0, 0, .45), inset 0 0 0 1px rgba(12, 18, 32, .55);
}

body {
    margin: 0;
    display: flex;
    place-items: center;
    min-width: 320px;
    min-height: 100vh;
}

* {
    box-sizing: border-box;
}


#app {
    margin: 0 auto;
    padding: 0;
    text-align: center;
    width: 100%;
    height: 100vh;
}

